<template>
	<view>
		<view class="content">
			<t-table>
				<t-tr>
					<t-th>工号</t-th>
					<t-th>姓名</t-th>
					<t-th>操作</t-th>
				</t-tr>
				<t-tr v-for="(item, index) in person" :key="index">
					<t-td>{{item.id}}</t-td>
					<t-td>{{item.personName}}</t-td>
					<t-td>
						<view @click="del(item.id)">删除</view>
					</t-td>
				</t-tr>
			</t-table>
		</view>
		<view class="input-item">
			<view class="text-input">
				<input type="text" placeholder="请输入工号以添加成员" v-model="tid"/>
			</view>
			<view class="iconfont" @click="add">&#xe6ad;</view>
		</view>
		<view class="bottom">
			<button type="primary" @click="submit">
				<text class="iconfont2">&#xe612;</text>提交
			</button>
		</view>
	</view>
</template>
<script>
	import {
		findPersonById,
		createQuestionnaire,
		addMember
	} from '@/api/questionnaire.js'
	import tTable from '@/components/t-table/t-table.vue';
	import tTh from '@/components/t-table/t-th.vue';
	import tTr from '@/components/t-table/t-tr.vue';
	import tTd from '@/components/t-table/t-td.vue';
	export default {
		components: {
			tTable,
			tTh,
			tTr,
			tTd,
		},

		data() {
			return {
				name: '',
				con: '',
				tid: '',
				id: [], //保存的数据
				person: [], //人姓名
			}
		},
		methods: {
			add() {
				findPersonById({
					id: this.tid
				}).then(res => {
					if (res.data.code == 0) {
						this.id.push(this.tid) //要提交的数据
						this.person.push({
							id: this.tid,
							personName: res.data.data.name
						})
						this.tid = ''
						uni.setStorage({
							key: 'qMember',
							data: JSON.stringify(this.id),
						})
					} else {
						uni.showModal({
							content: '请确保工号正确'
						})
					}
				}).catch(err => {
					uni.showModal({
						content: '请求出错'
					})
				})
			},
			del(target) {
				for (let i in this.id) {
					if (this.id[i] == target) {
						this.id.splice(i, 1)
						this.person.splice(i, 1)
						break
					}
				}
			},
			submit() {
				// 问卷的数据
				let question = uni.getStorageSync('assessment')	
				question = JSON.parse(question)
				let obj = {
					questionnaire: {
						name: question.name,
						creatorId: getApp().globalData.id,
						con: question.con,
						type:2
					},
					list: []
				}
				for (let tmp in question.question) {
					let obj2 = []
					for (let tmpp in question.question[tmp].optionItems) {
						obj2.push({
							questionnaireQuestionId: Number(tmp) + 1,
							optionContent: question.question[tmp].optionItems[tmpp],
							optionType: Number(tmpp) + 1
						})
					}
					obj.list.push({
						questionnaireQuestion: {
							questionnaireQuestionId: Number(tmp) + 1,
							questionnaireSubjectContent: question.question[tmp].questionTitle
						},
						questionnaireOptions: obj2
					})
				}
				// console.log(obj)
				uni.showLoading()
				createQuestionnaire(obj).then(res1 => {
					if (res1.data.code == 0) {
						let count = this.id.length
						for (let i in this.id) {
							addMember({
								questionnaireId: res1.data.data.questionnaire.questionnaireId,
								userId: this.id[i],
								answer: 0
							}).then(res2 => {
								count--
								if (count == 0)
									uni.hideLoading()
							})
						}
						uni.showModal({
							content: '已提交',
							success() {
								uni.navigateBack({
									delta: 2
								})
							}
						})
					}
					// console.log(res1)
				}).catch(err => {
					console.log(err)
					uni.hideLoading()
				})
			}
		}
	}
</script>

<style>
	page{
		background-color: #fffdf4;
	}
	
	.input-item {
		height: auto;
		position: relative;
		height: 40px;
		margin: 0 5px;
		/* padding: 0 20px; */
		box-sizing: border-box;
		margin: 0 20px;
		border-bottom: 1px solid #C0C0C0;
	}

	.input-item  .text-input {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 90%;
		height: 100%;
		padding-left: 10px;
	}
	
	.iconfont {
		font-family: "iconfont" !important;
		font-size: 30px;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		float: right;
		color: #666666;
	}
	
	.bottom {
		margin-top: 5px;
		padding: 0 10px;
		text-align: center;
	}

	.content {
		margin-bottom: 20px;
		padding: 10px;
	}
	.iconfont2{
		font-family: "iconfont" !important;
		font-size: 16px;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		margin-right: 10px;
	}
</style>
